<include file="public@header" />
<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="__STATIC__/js/admin.js?v={:time()}"></script>
    <script type="text/javascript" src="__STATIC__/js/gaopaiyi/gpy.js?v={:time()}"></script>
    <style>
        .processNum{
            position: absolute;
            left: 620px;
            color: #0a0909;
            font-size: 16px;
            height: 35px;
        }
    </style>
</head>
<body onload="onLoad(0)" >
<table>
    <tr>
        <td>
            <div  style="width: 600px;height: 440px; margin-left:2px;margin-right: 2px;margin-top: 2px;">
                <canvas id="bigPriDev" width="600" height="440" value="123" style="border:1px solid #000000;"> </canvas>
        </div> </td>
        <td>
            <div   style="margin:-32px 0 0 12px; " >
                <div  style="  width: 399px;height: 309px;">
                    <img id="Base64IMG" width="399" height="309"  style="padding: 2px;" /></img>
                </div>
                <div  >
                    <div>
                        <input type="hidden" id="path_file_id" value="" >
                        <input type="hidden" id="path_file" value="" >
                        <input type="hidden" id="path_title" value="" >
                        <input type="hidden" id="path_imgbase64" value="" >
                        <div style="height: 31px;">
                            <span class="processNum"></span>
                        </div>
                        <div>
                            <h5 class="btn btn-success show_id_1" data-show="1" onclick="bbase64();" >拍照</h5>
                            <h5 id="uploadFile"  class="btn btn-primary show_id_3" data-show="3" >上传</h5>
                        </div>
                    </div>
                </div>
            </div>
        </td>
    </tr>
</table>
<script>
    function child(n) {
        $('#path_file_id').val(n.id);
        $('#path_file').val(n.path);
        $('#path_title').val(n.title);
    }
    $('#uploadFile').click(function () {
        var path_title = $('#path_title').val();
        var input_selector = $('#path_file_id').val();
        var path_file = $('#path_file').val();
        var container = $('#path_imgbase64').val();
        $('.processNum').text("正在上传图片......");//数显进度
        $.ajax({
            url: "{:url('user/asset/gaopaiyi')}",
            type: 'post',
            data:{path:path_file,pathbase64:container},
            xhr:function(){
                //获取上传进度
                myXhr = $.ajaxSettings.xhr();
                if(myXhr.upload){
                    myXhr.upload.addEventListener('progress',function(e){
                        //监听progress事件
                        var loaded = e.loaded;//已上传
                        var total = e.total;//总大小
                        var percent = Math.floor(100*loaded/total);//百分比
                        console.log(percent)
                        $('.processNum').text(percent+"%   请稍后......");//数显进度
                        $('.processNum').css("width",percent+"px");//图显进度
                    }, false);
                }
                return myXhr;
            },
            success: function (data) {
                if (data.code==1){
                    $('.processNum').text("上传完成。");//数显进度
                    $(window.parent.document).find(input_selector).attr('value',data.data.filepath);
                    $(window.parent.document).find(input_selector + '-preview').attr('src', data.data.preview_url);
                }
                parent.layer.closeAll();
            }
        })

    })
    function aginCallBack() {
        if(xmlHttp.readyState == 4){
            if(xmlHttp.status == 200) { //status状态正常时
                var response = xmlHttp.responseText;      //将服务器返回的值赋予response
                //alert("xmlHttp.responseText="+response);
                document.getElementById("progress-bar").style.width = response+'%';    //将得到的值+‘%’号，然后赋值与进度条style的width属性
                if(response <=100){   //应为进度条的最大值也就是100%,所以返回值不能大于10,如果大于100则不再请求,当然服务端返回的值最大也为100
                    t = setTimeout("startRun()",1000);   //每隔一秒钟就调用一次startRun()函数
                }else{
                    document.getElementById("txt").style.visibility = "visible";
                    document.getElementById("txt").value = "100%完成更新";
                }
            }
        }
    }

</script>
</body>
</html>
